/*
 * @Author: silas 
 * @Date: 2021-03-24 11:02:31 
 * @Last Modified by: silas
 * @Last Modified time: 2021-06-04 14:45:29
 */
<template>
    <div class="clearing">
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="预算画饼记录" name="first">
                <tab1 ref="tab1"></tab1>
            </el-tab-pane>
            <el-tab-pane label="预算画饼明细" name="second">
                <tab2 ref="tab2"></tab2>
            </el-tab-pane>
            <el-tab-pane label="基础配置记录" name="third">
                <tab3 ref="tab3"></tab3>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
import { $budgetAPI } from "@/api/";
import { getSessionStorage } from "@/common/js/storage";
import prefixAPI from "@/api/prefixAPI";
import { getCookie } from "@/common/js/cookie";
import FileSaver from "file-saver";
import XLSX from "xlsx";

import tab1 from "./circle-tab1";
import tab2 from "./circle-tab2";
import tab3 from "./circle-tab3";

export default {
    name: "clearingTabs",
    components: {
        tab1,
        tab2,
        tab3,
    },
    data() {
        return {
            activeName: "first",
        };
    },
    mounted() {
       this.$refs.tab1 && this.$refs.tab1.init();
    },
    methods: {
        handleClick(tab, event) {
            if (tab.name == "first") {
                this.$refs.tab1.init();
            }
            if (tab.name == "second") {
                this.$refs.tab2.init();
            }
            if (tab.name == "third") {
                this.$refs.tab3.init();
            }
        },
    },
};
</script>

<style lang="scss" scoped>
</style>